<template>
  <div>
    <el-switch
      v-model="showCheck"
      active-text="多选"
      inactive-text="单选">
    </el-switch>
    <KunkkaTree
      ref="tree"
      :data="data"
      :show-checkbox="showCheck"
      check-strictly
      :checked="true"
      :highlight-current="true"
      :default-expand-all="true"
      @node-click="handleNodeClick"
      @treeCheck="treeCheck"
      style="width: 300px; margin-top: 20px;"
    />
    <div class="markdown-body">
      <readme />
    </div>
  </div>
</template>

<script>
import Readme from './readme.md';
export default {
  name: 'kunkkaTreeDoc',
  components: { Readme },
  data() {
    return {
      data: [
        {
          id: 0,
          label: '舜宇集团',
          children: [
            {
              id: 1,
              label: '阳明产业园',
              children: []
            },
            {
              id: 2,
              label: '兰江产业园',
              children: []
            }
          ]
        }
      ],
      showCheck: false
    };
  },
  methods: {
    handleNodeClick(data) {
      console.log(data);
    },
    treeCheck(data) {
      console.log(data)
    }
  }
};
</script>

<style></style>
